import 'package:flutter/material.dart';

import 'package:heven/model/goods_model.dart';

class ItemWidget extends StatefulWidget {
  const ItemWidget({
    super.key,
    this.favorable = false,
    this.activeIndex = 0,
    this.index = 0,
    this.info,
    this.artConsumeCoinNumber = 0,
    this.onChanged,
  });
  final bool favorable;
  final int activeIndex;
  final int index;
  final ValueChanged? onChanged;
  final Goods? info;
  final int artConsumeCoinNumber;
  @override
  State<ItemWidget> createState() => _ItemWidgetState();
}

class _ItemWidgetState extends State<ItemWidget> {
  @override
  Widget build(BuildContext context) {
    var coin = int.parse(widget.info!.coin ?? '0');

    var num = coin / widget.artConsumeCoinNumber;

    return Stack(
      children: [
        GestureDetector(
          onTap: () {
            widget.onChanged!(widget.index);
          },
          child: Container(
            height: 120,
            width: 100,
            margin: const EdgeInsets.fromLTRB(9, 9, 9, 0),
            decoration: BoxDecoration(
              border: Border.all(
                width: 2,
                color: widget.activeIndex == widget.index
                    ? const Color(0xFF02FFD6)
                    : const Color(0xFFAFAFAF),
              ),
              borderRadius: BorderRadius.circular(10),
              color: const Color(0xFF323851),
            ),
            child: Column(
              children: [
                const SizedBox(
                  height: 15,
                ),
                Center(
                  child: Text(
                    widget.info!.title,
                    style: const TextStyle(
                      fontSize: 14,
                      color: Colors.white,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
                const SizedBox(
                  height: 8,
                ),
                Center(
                  child: Text(
                    '￥${widget.info!.price}',
                    style: const TextStyle(
                      fontSize: 16,
                      color: Colors.white,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
                const SizedBox(
                  height: 4,
                ),
                Center(
                  child: Text(
                    '${num.toInt()}首音乐',
                    style: const TextStyle(
                      fontSize: 13,
                      color: Color(0xFF02FFD6),
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
                const SizedBox(
                  height: 6,
                ),
                Center(
                  child: Text(
                    '${widget.info!.coinDesc}',
                    style: const TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                      height: 1.4,
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
        Positioned(
            left: 9,
            top: 0,
            child: Offstage(
              offstage: widget.favorable,
              child: Container(
                width: 54,
                height: 20,
                decoration: const BoxDecoration(
                  color: Color(0xFFFCD28D),
                  borderRadius: BorderRadius.only(
                    topRight: Radius.circular(10.0), // 右上角圆角
                    bottomRight: Radius.circular(10.0), // 右下角圆角
                  ),
                  // borderRadius: BorderRadius.only(topRight: Border.),
                ),
                child: Center(
                  child: Text(
                    '${widget.info!.tagsDesc}',
                    style: const TextStyle(
                      fontSize: 11,
                      color: Colors.black,
                      height: 1.4,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ),
            )),
      ],
    );
  }
}
